<template>
    <div class="dormitory-pagination">
        <el-pagination
                background
                :pager-count="15"
                :page-sizes="[10, 20, 30, 40, 50, 100]"
                :page-size="pagination.size"
                :current-page="pagination.current"

                @size-change="sizeChange"
                @current-change="currentChange"
                @prev-click="prevClick"
                @next-click="nextClick"

                layout="total, prev, pager, next, sizes, jumper"
                :total="pagination.total">
        </el-pagination>
    </div>
</template>

<script>

    import PageSizeUtils from "../../../utils/PageSizeUtils";

    export default {
        name: "DormitoryPagination",
        props: {
            pagination: {
                type: Object,
                default: () => {
                    total: 0;
                    current: 1;
                    size: 10;
                }
            },
            parentMethod: {
                type: Function,
                default: null
            }
        },
        data() {
            return {


            };
        },
        methods: {
            listPage(current, size) {
                if (this.parentMethod) {
                    console.log("zoul---",current,size)
                    this.parentMethod(current, size);
                }
            },
            sizeChange(val) {
                this.$store.dispatch('savePaginationSize', val);
                this.listPage(1, val);
            },
            currentChange(val) {
                this.$store.dispatch('savePagination', this.pagination);
                this.listPage(val, this.pagination.size);
            },
            prevClick(val) {
            },
            nextClick(val) {
            },
        },
        created() {
        },
        computed: {
            setPagination() {
                return this.$store.state.Navigation.pagination;
            }
        },
        watch: {
            setPagination() {
                PageSizeUtils.setPagination()
            }
        }
    }
</script>

<style scoped>
    .dormitory-pagination {
        bottom: 0px;
        padding-top: 10px;
        height: 40px;
    }
</style>